import 'package:flutter/material.dart';
import 'package:fsharing/core/viewmodels/pages/mine/user_password_update_model.dart';
import 'package:fsharing/core/viewmodels/view_model.dart';
import 'package:fsharing/ui/widgets/background_container.dart';
import 'package:fsharing/ui/widgets/round_back_button.dart';
import 'package:oktoast/oktoast.dart';
import 'package:provider/provider.dart';

class UserPasswordPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (context) => UserPasswordUpdateModel(Provider.of(context, listen: false)),
      child: BackgroundContainer(
        child: Scaffold(
          appBar: AppBar(
            leading: RoundBackButton(),
            title: Text('修改密码'),
          ),
          body: SingleChildScrollView(
            padding: EdgeInsets.symmetric(horizontal: 12),
            child: Builder(
              builder: (context) {
                UserPasswordUpdateModel model = Provider.of(context, listen: false);
                return Column(
                  children: <Widget>[
                    _WrapContainer(
                      child: TextFormField(
                        decoration: InputDecoration(
                          hintText: '旧密码',
                        ),
                        obscureText: true,
                        onChanged: (value) {
                          model.oldPassword = value;
                        },
                      ),
                    ),
                    _WrapContainer(
                      margin: EdgeInsets.only(top: 10),
                      child: TextFormField(
                        decoration: InputDecoration(
                          hintText: '新密码',
                        ),
                        obscureText: true,
                        onChanged: (value) {
                          model.newPassword = value;
                        },
                      ),
                    ),
                    _WrapContainer(
                      margin: EdgeInsets.only(top: 10),
                      child: TextFormField(
                        decoration: InputDecoration(
                          hintText: '确认密码',
                        ),
                        obscureText: true,
                        onChanged: (value) {
                          model.newPasswordConfirm = value;
                        },
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.only(top: 40),
                      width: 256,
                      height: 65,
                      child: Consumer<UserPasswordUpdateModel>(
                        builder: (context, model, child) {
                          switch (model.viewState) {
                            case ViewState.busy:
                              return RaisedButton(
                                onPressed: null,
                                child: SizedBox(
                                  child: CircularProgressIndicator(),
                                ),
                              );
                            default:
                              return RaisedButton(
                                onPressed: () {
                                  _onUpdateClicked(context);
                                },
                                child: Text(
                                  '确定',
                                  style: TextStyle(fontSize: 18),
                                ),
                              );
                          }
                        },
                      ),
                    ),
                  ],
                );
              },
            ),
          ),
        ),
      ),
    );
  }

  void _onUpdateClicked(BuildContext context) async {
    UserPasswordUpdateModel model = Provider.of(context, listen: false);
    var viewState = await model.userPasswordUpdate();
    switch (viewState) {
      case ViewState.error:
        showToast(model.errorMessage);
        break;
      default:
        showToast('更新成功');
        Navigator.of(context).pop();
        break;
    }
  }
}

class _WrapContainer extends StatelessWidget {
  final EdgeInsetsGeometry margin;
  final Widget child;

  _WrapContainer({
    Key key,
    this.margin,
    this.child,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      alignment: Alignment.center,
      padding: EdgeInsets.symmetric(horizontal: 16),
      color: Colors.white10,
      height: 50,
      margin: margin,
      child: child,
    );
  }
}
